/*
	patternLock.js v 0.1.1
	Author: Sudhanshu Yadav
	Copyright (c) 2013 Sudhanshu Yadav - ignitersworld.com , released under the MIT license.
	Demo on: ignitersworld.com/lab/patternLock.html
*/
.outer {
    width: 310px;
    height: 310px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -155px;
    margin-top: -155px;
}

.patt-holder {
    background: #000;
}

.patt-wrap {
    position: relative;
    cursor: pointer;
}

    ul.patt-wrap , .patt-wrap li {
        list-style: none;
        margin: 0px;
        padding: 0px;
    }

.patt-circ {
    position: relative;
    float: left;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

    .patt-circ.hovered {
        border: 3px solid #000000;
    }

.patt-error .patt-circ.hovered {
    border: 3px solid #BA1B26;
}

.patt-hidden .patt-circ.hovered {
    border: 0;
}

.patt-dots {
    background: #fff;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -5px;
    margin-left: -5px;
}

.patt-lines {
    border-radius: 5px;
    height: 10px;
    background: rgba(255, 255, 255, .7);
    position: absolute;
    transform-origin: 5px 5px;
    -ms-transform-origin: 5px 5px; /* IE 9 */
    -webkit-transform-origin: 5px 5px;
}

.patt-hidden .patt-lines {
    display: none;
}
